Commerce Stream Practicals

Std 12th IT Subject (Commerce Stream)

SOP 6: Use of Video on web pages using HTML5

Create a webpage named video.HTML to display a video file on web page and plays automatically. The dimension of video area should be 150 * 150 pixels.
Create another webpage which video provide multiple source file formats for the same video file that plays a video with controls. The dimension of video area should be 300*300 pixels. The code must incorporate the list of video files formats (like webM, MP4 or ogg etc).

Source Code: Video.html

<!DOCTYPE html>
<html>
<head>
    <title>Video with controls</title>
</head>
<body>
    <h1>Video With Single Source</h1>
    <video width="150px" height="150px" autoplay>
        <source src="Video.mp4" type="video/mp4">
    </video>
</body>
</html>

Source Code: Video1.html

<!DOCTYPE html>
<html>
<head>
    <title>Video with controls</title>
</head>
<body>
    <h1>Video With Multiple Source</h1> 
    list of Video files
    <ol>
        <li>Video.mp4</li>
        <li>Video.ogg</li>
        <li>Video.webm</li>
    </ol>   
    <video width="300px" height="300px" autoplay controls>
        <source src="Video.mp4" type="video/mp4">
        <source src="Video.ogg" type="video/ogg">
        <source src="Video.webm" type="video/webm">    
        Your computer doesn't support Video file    
    </video>
</body>
</html>

SOP 6: Use of Video on web pages using HTML5

Source Code: Video.html

Source Code: Video1.html

Live Preview